---
metaTitle: Box
metaDescription: Fundamental layout building block.
sourcePath: components/box
---

```jsx live=true
<Box width="64px" height="64px">
	<DecorativeBox />
</Box>
```

## API Reference

This component is based on the `div` element and supports [common margin props](/themes/docs/overview/layout#margin-props).

Only the `display` prop values are unique to the Box component.

<ThemesPropsTable defs="boxPropDefs" />

The following props are shared between [Box](./box), [Flex](./flex), [Grid](./grid), [Container](./container) and [Section](./section) components. Read more about layout components in [Layout](/themes/docs/overview/layout).

<ThemesPropsTable defs="layoutPropDefs" />
